<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <title>学生信息管理系统</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/login.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
    <script src="${pageContext.request.contextPath}/layui/axios.min.js"></script>
    <script src="${pageContext.request.contextPath}/layui/common.js"></script>

</head>
<body class="login-bg">

<div class="layui-card login">
    <div class="layui-card-header site"><b>SMMS学生信息管理系统</b></div>
    <div class="layui-card-body">
        <form class="layui-form" method="post" enctype="application/x-www-form-urlencoded">
            <div class="layui-form-item">
                <input type="text" name="username" placeholder="请输入工号/学号" lay-verify="required|number"
                       autocomplete="off" class="layui-input">
            </div>

            <div class="layui-form-item">
                <input type="password" name="password" placeholder="请输入密码" lay-verify="required" autocomplete="off"
                       class="layui-input">
            </div>

            <div class="layui-form-item" style="text-align: right">
                <div class="layui-input-block">
                    <input type="radio" name="role" value="teacher" title="教师" checked>
                    <input type="radio" name="role" value="student" title="学生">
                </div>
            </div>
            <div class="layui-form-item">
                <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="*">登录</button>
            </div>
        </form>
    </div>
</div>

<script>
    layui.use("form", function () {
        let form = layui.form;

        form.on("submit(*)", function (data) {
            axios.post("${pageContext.request.contextPath}/login", data.field, {headers: {"Content-Type": "application/x-www-form-urlencoded"}}).then(ret => {
                if (ret.data.status) {
                    // 记录当前用户的角色
                    localStorage.setItem("role", ret.data.data.role);
                    localStorage.setItem("user", ret.data.data.username);
                    // 跳转到系统首页
                    window.location.href = "${pageContext.request.contextPath}/";
                } else if (ret.data.code === 20000) {
                    // 获取错误消息
                    for (let key in ret.data.error) {
                        layer.msg(ret.data.error[key])
                    }
                }
            })
            return false
        })
    })
</script>

</body>
</html>
